<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <title>Document</title>
    <link rel="stylesheet" type="text/css" href="{{ asset('index/static/css/main.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('index/layui/css/layui.css') }}">
    <script type="text/javascript" src="{{ asset('index/layui/layui.js') }} "></script>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
</head>
<body>


<div class="content content-nav-base  login-content">

    <div class="login-bg">
        <div class="login-cont w1200">
            <div class="form-box">
                <form class="layui-form" action="">
                    <legend>手机号登录</legend>
                    <div class="layui-form-item">
                        <div class="layui-inline iphone">
                            <div class="layui-input-inline">
                                <i class="layui-icon layui-icon-cellphone iphone-icon"></i>
                                <input type="tel" name="phone" id="phone" lay-verify="required|phone" placeholder="请输入手机号" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline veri-code">
                            <div class="layui-input-inline">
                                <input id="pnum" type="text" name="pnum" lay-verify="required" placeholder="请输入验证码" autocomplete="off" class="layui-input">
                                <input type="button" class="layui-btn" id="find"  value="验证码" />
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item login-btn">
                        <div class="layui-input-block">
                            <button class="layui-btn" id="submitLogin" type="button">登录</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript">
    layui.config({
        base: '/index/static/js/util' //你存放新模块的目录，注意，不是layui的模块目录
    }).use(['jquery','form'],function(){
        var $ = layui.$,form = layui.form;


        $("#find").click(function() {
            if(!/^1\d{10}$/.test($("#phone").val())){
                layer.msg("请输入正确的手机号");
                return false;
            }
            var obj=this;
            $.ajax({
                type:"post",
                url:"/sendSMS",
                data:{'phone':$("#phone").val()},
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                // dataType:"json",//返回的
                success:function(res) {
                    data = JSON.parse(res)
                    if(data.code==200){
                        $("#find").addClass(" layui-btn-disabled");
                        $('#find').attr('disabled',"true");
                        layer.msg(data.msg);
                        settime(obj);
                        // $("#msg").text(data.msg);

                    }else{
                        layer.msg(data.msg);
                    }
                },
                error:function(data) {
                    console.log('err');
                }
            });
        })
        var countdown=60;
        function settime(obj) {
            if (countdown == 0) {
                obj.removeAttribute("disabled");
                obj.classList.remove("layui-btn-disabled")
                obj.value="获取验证码";
                countdown = 60;
                return;
            } else {

                obj.value="重新发送(" + countdown + ")";
                countdown--;
            }
            setTimeout(function() {
                    settime(obj) }
                ,1000)
        }

        $("#submitLogin").click(function() {

            $.ajax({
                type:"post",
                url:"/check",
                data:{'phone':$("#phone").val(),'code':$("#pnum").val()},
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                // dataType:"json",//返回的
                success:function(res) {
                    res = JSON.parse(res)
                    // res = res.data;
                    console.log(res);
                    if(res.code==200){

                        layer.msg('登录成功', {icon: 1, time: 1500}, function () {


                            location.href = '/user';
                        });
                        return false;
                    }else {
                        layer.msg(res.msg, {icon: 2, time: 1500}, );
                    }
                },
                error:function(data) {
                    console.log('err');
                }
            });
        })


    })
</script>

</body>
</html>